<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bridge Hand Player</title>
    
    <link href="css/bridge-hand-player.css" rel="stylesheet">
    
    <!-- jQuery -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->      
  </head>
  <body>
  	<header>
		<nav id="header" class="navbar navbar-default navbar-fixed-top" role="navigation">
		   <div class="navbar-header">
		      <button type="button" class="navbar-toggle" data-toggle="collapse" 
		         data-target="#header-bar">
		         <span class="sr-only">Toggle navigation</span>
		         <span class="icon-bar"></span>
		         <span class="icon-bar"></span>
		         <span class="icon-bar"></span>
		      </button>
		      <a class="navbar-brand tooltip-bottom" title="Bridge Hand Player"><img src="images/bhp_logo.png"></img>BHP <span id="header-title"></span></a>
		   </div>
		   <div class="collapse navbar-collapse" id="header-bar">
			<ul class="nav navbar-nav">
				<li class="dropdown">
					<a class="tooltip-bottom" title="Change Color Scheme" href="#" class="dropdown-toggle" data-toggle="dropdown">Skin : <span id="current-theme">Default</span> (Change)<b class="caret"></b></a>
					<ul id="themes" class="dropdown-menu">
					</ul>
				</li>	
		         <li class="dropdown">
		            <a class="tooltip-bottom" title="Share with others" href="#" class="dropdown-toggle" data-toggle="dropdown">
		               Generate URL/Embed Code
		               <b class="caret"></b>
		            </a>
		            <ul class="dropdown-menu">
		               <li><a id="bbo_url" all="false" class="tooltip-bottom btn generate-url" title="This will only include currently active line of play and not any saved line of plays"><img src="images/bbo_logo.png" height="30"></img> Bridge Base Hand Viewer URL</a></li>
		               <li><a id="bw_url" all="false" class="tooltip-bottom btn generate-url" title="This will only include currently active line of play and not any saved line of plays"><img src="images/bw_logo.png" height="30"></img> Bridge Winners Embed Code</a></li>
		               <li class="divider"></li>
		               <li><a id="bhp_url" all="true" class="tooltip-bottom btn generate-url" title="This will include all saved line of plays and the current line of play if it is not saved"><img src="images/bhp_logo.png"></img> BHP (this tool) Extended Format URL</a></li>
		            </ul>
		         </li>										    
			</ul>		   
		      <p class="navbar-text">
		      	<a id="show-options" class="tooltip-bottom" href="javascript:void(0);" title="Change Settings"><span class="glyphicon glyphicon-cog"></span></a>		      
		      	<a id="show-instructions" class="tooltip-bottom" href="javascript:void(0);" title="Instructions"><span class="glyphicon glyphicon-question-sign"></span></a>
		      	<a id="show-contact" class="tooltip-bottom" href="javascript:void(0);" title="Send Feedback/Suggestions/Bug Reports"><span class="glyphicon glyphicon-envelope"></span></a>
		      </p>
		   </div>
		</nav>  
	</header>
	<section id="section"></section>
	<footer id="footer"></footer>
	
	<div class="modal fade" id="modal-dialog" tabindex="-1" role="dialog" aria-labelledby="modal-dialog-title" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header"></div>
	            <h4 id="modal-dialog-title" class="modal-title">Loading</h4>
	         </div>
	         <div class="modal-body">
				<form role="form" onsubmit="return false;">
				  <div id="modal-dialog-content" class="form-group">Content</div>
				</form>	
	         </div>
	         <div class="modal-footer">     
	         </div>	      
	      </div><!-- /.modal-content -->
	   </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->		
	
	<div class="modal fade" id="modal-popup" tabindex="-1" role="dialog" aria-labelledby="modal-popup-title" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
	            <h4 id="modal-popup-title" class="modal-title">Title</h4>
	         </div>
	         <div class="modal-body">
				<form role="form" onsubmit="return false;">
				  <div id="modal-popup-content" class="form-group">Content</div>
				</form>	
	         </div>
	         <div class="modal-footer">     
	            <button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
	         </div>
	      </div><!-- /.modal-content -->
	   </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->	
	
	<div class="modal fade" id="modal-popup-confirm" tabindex="-1" role="dialog" aria-labelledby="modal-popup-confirm-title" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
	            <h4 id="modal-popup-confirm-title" class="modal-title">Title</h4>
	         </div>
	         <div class="modal-body">
				<form role="form" onsubmit="return false;">
				  <div id="modal-popup-confirm-content" class="form-group">Content</div>
				</form>	
	         </div>
	         <div class="modal-footer">     
	         	<button id="modal-popup-confirm-ok" type="button" class="btn btn-primary">OK</button>
	            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
	         </div>
	      </div><!-- /.modal-content -->
	   </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->		
	
	<div class="modal fade" id="modal-popup-save" tabindex="-1" role="dialog" aria-labelledby="modal-popup-save-title" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <button class="close" data-dismiss="modal" aria-hidden="true">×</button>
	            <h4 id="modal-popup-save-title" class="modal-title">Title</h4>
	         </div>
	         <div class="modal-body">
				<form role="form" onsubmit="return false;">
				  <div class="form-group">
				    <label for="text-field">Type/Edit Value</label>
				    <input type="text" autofocus class="form-control" id="modal-popup-save-content" placeholder="Enter/Edit Value">
				  </div>
				</form>		         
	         </div>
	         <div class="modal-footer">     
	            <button id="modal-popup-save-ok" type="button" class="btn btn-primary">Save Value</button>         
	            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
	         </div>
	      </div><!-- /.modal-content -->
	   </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->		
	
	<div class="modal fade" id="modal-popup-options" tabindex="-1" role="dialog" aria-labelledby="modal-popup-options-title" aria-hidden="true">
	   <div class="modal-dialog">
	      <div class="modal-content">
	         <div class="modal-header">
	            <button class="close" data-dismiss="modal" aria-hidden="true">×</button>
	            <h4 id="modal-popup-options-title" class="modal-title">Change Settings/Options</h4>
	         </div>
	         <div id="modal-popup-options-body" class="modal-body">	         
	         </div>
	         <div class="modal-footer">     
	            <button id="modal-popup-options-ok" type="button" class="btn btn-primary">Save Options</button>         
	            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
	         </div>
	      </div><!-- /.modal-content -->
	   </div><!-- /.modal-dialog -->
	</div><!-- /.modal -->				
  
  	<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script> 	
  	<script src="js/bridge-hand-player-min.js"></script>  
  </body>
</html>